<!--出库登记详情-查看model-->
<template>
  <div>
    <cus-modal ref="modal" title="详情" @onOk="onOk" width="1300">
      <Table
        border
        :loading="form.loading"
        :columns="columns"
        :data="data"
        :size="vuex_config.tableSize"
      >
      <template slot-scope="{ row }" slot="imgOperation">
          <div class="flex">
            <cus-button
              type="text"
              size="small"
              style="color:#1E6FFF;padding: 0 5px"
              @onClick="onShow(row)"
            >
              <Icon type="ios-search" size="4" style="margin: 2px 3px 0 0" />
              <span>查看</span>
            </cus-button>
          </div>
        </template>
        <template slot-scope="{ row }" slot="operation">
          <div class="flex">
            <cus-button
              type="text"
              size="small"
              :disabled="checkStatus == 0"
              :style="{
                color: checkStatus == 0 ? '#DADADA' : '#FF4746',
              }"
              style="padding: 0 5px"
              @onClick="onDelete(row)"
            >
              <Icon type="md-trash" size="4" style="margin: 2px 5px 0 0" />
              <span>删除</span>
            </cus-button>
          </div>
        </template>
      </Table>
      <div slot="footer">
        <slot name="footer">
          <div class="modal-footer">
            <cus-button size="small" class="mr_2" @onClick="onCancel"
              >取消</cus-button
            >
            <cus-button type="primary" size="small" @onClick="onCancel"
              >确认</cus-button
            >
          </div>
        </slot>
      </div>
    </cus-modal>
    <!--查看称重图片-->
    <Modal
      v-model="showModal"
      width="800"
      title="查看图片"
    >
     <div>
        <img :src="picture" v-if="picture" alt="" style="height:100%;width:100%;">
        <div v-else style="text-align:center;">暂无图片</div>
     </div>
    </Modal>
  </div>
</template>

<script>

const columns = [
  {
    title: "序号",
    type: "index",
    minWidth: 70,
    align: "center",
  },
  {
    title: "数量",
    key: "qty",
    minWidth: 75,
    align: "center",
  },
  {
    title: "重量",
    key: "weight",
    minWidth: 75,
    align: "center",
  },
  {
    title: "计量单位",
    key: "unit",
    minWidth: 75,
    align: "center",
  },
  {
    title: "去皮",
    key: "deductWeight",
    minWidth: 75,
    align: "center",
  },
  {
    title: "扣重",
    key: "punishWeight",
    minWidth: 75,
    align: "center",
  },
  {
    title: "单价(元)",
    key: "price",
    minWidth: 75,
    align: "center",
  },
  {
    title: "金额(元)",
    key: "amount",
    minWidth: 75,
    align: "center",
  },
  {
    title: "设备编号",
    key: "deviceNo",
    minWidth: 100,
    align: "center",
  },
  {
    title: "验收时间",
    key: "createTime",
    minWidth: 175,
    align: "center",
  },
  {
    title: "出库照片",
    slot: "imgOperation",
    minWidth: 135,
    align: "center",
  },
  {
    title: "备注",
    key: "remark",
    minWidth: 175,
    align: "center",
  },
];
const form = {
  loading: false,
};
export default {
  name: "",
  computed: {},
  data() {
    return {
      form: form,
      columns: columns,
      picture:null,//称重图片
      showModal:false,//查看图片弹框
      checkStatus:null,
      data: [],
      pages: {
        //分页
        page: 1,
        pageSize: 10,
        pageTotal: 0,
      },
    };
  },
  mounted() {},
  methods: {
    show() {
      this.loading = false;
      this.$refs["modal"].show = true;
    },
    onOk() {},
    //取消
    onCancel() {
      this.$refs["modal"].show = false;
    },
    onShow(row) {
        console.log(row)
        this.picture = row.image;
        this.showModal = true;
    },
  },
  computed: {},
  watch: {},
};
</script>

<style scoped>
</style>
